<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=0,maximum-scale=0,user-scalable=yes,shrink-to-fit=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>表单设计器</title>
    <link rel="stylesheet" href="/static/component/layui/css/layui.css" />
    <link rel="stylesheet" href="/static/component/designer/modules/cron.css" />
    <link rel="stylesheet" href="/static/component/designer/modules/labelGeneration.css" />
    <link rel="stylesheet" href="/static/component/designer/modules/formDesigner.css" />
    <link rel="stylesheet" href="/static/component/designer/alifont/iconfont.css" />
</head>

<body class="layui-layout-body">

<div style="height: 100%; width: 100%;" id="formdesigner">

</div>

<div id="sync-data-div" style="display: none;">
    <form class="layui-form" action="" style="padding:20px" lay-filter="sync-form">
        <div class="layui-form-item">
            <label class="layui-form-label">来源表</label>
            <div class="layui-input-block">
                <select name="table" id="from_table" lay-verify="required" lay-filter="sync-table">

                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">选项</label>
            <div class="layui-input-block">
                <select name="key" id="check_key" lay-verify="required">

                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">选项值</label>
            <div class="layui-input-block">
                <select name="value" id="check_val" lay-verify="required">

                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="sync_data_sub" style="background-color: #5FB878">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
</div>

<div id="error-data-div" style="display: none;">
    <blockquote class="layui-elem-quote">信息不全或冲突的组件，将被系统删除！</blockquote>
    <table class="layui-table">
        <thead>
        <tr>
            <th>组件</th>
            <th>错误详情</th>
        </tr>
        </thead>
        <tbody id="error-table">

        </tbody>
    </table>
</div>

<script type="text/javascript" src="/static/component/layui/layui.js"></script>
<script type="text/javascript" src="/static/component/designer/js/config.js"></script>
<script type="text/javascript" src="/static/component/designer/modules/Sortable/Sortable.js"> </script>
<!--htmlformat 为js-beautify代码-->
<script type="text/javascript" src="/static/component/designer/js/htmlformat.js"></script>
<script type="text/javascript" src="/static/component/designer/js/jsformat.js"></script>
<script type="text/javascript" src="/static/component/designer/modules/iceEditor/iceEditor.js"></script>
<script>
    let formId = {$id};
    layui.config(
        {base: '/static/component/designer/modules/'}).use(['layer', 'formDesigner'], function () {
        var formDesigner = layui.formDesigner;
        var data = {$data|raw};
        var render = formDesigner.render({
            data:data,
            elem:'#formdesigner'
        });

    });
</script>

</body>

</html>